<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8" />
		<title>2.认识一下vm</title>
		<!-- 引入Vue -->
		<script type="text/javascript" src="../js/vue.js"></script>
	</head>
	<body>
		<!-- 
			总结：
				1.vm身上有很多$开头的属性或方法，这些属性或方法一般都是给我们程序员用的（也不都用）。
				2.data中所配置的属性，也不知道怎么了（以后会详细的说到底怎么了），最终都出现在了vm身上。
				3.vm身上所有的属性，以及顺着vm能找到的东西，都可以在模板中直接使用，但往往我们使用的只是那些data中配置的数据。
		 -->
		<!-- 准备好一个容器-->
		<div id="demo">
			<h1>学校名：{{school}}</h1>
			<h1>学校地址：{{address}}</h1>
			<h1>学校电话：{{tel}}</h1>
			<!-- <h1>测试1：{{_c}}</h1> -->
			<!-- <h1 :x="_c">测试2</h1> -->
			<!-- <h1>测试3：{{$options}}</h1> -->
			<!-- <h1>测试4：{{$emit}}</h1> -->
			<!-- <h1>测试5：{{toString}}</h1> -->
			<!-- <h1>测试6：{{qweasdxyz}}</h1> -->
			<!-- <h1>测试7：{{window.alert}}</h1> -->
		</div>

		<script type="text/javascript">
			//阻止 vue 在启动时生成生产提示。
			Vue.config.productionTip = false
			Vue.prototype.qweasdxyz = 99
			Vue.prototype.window = window

			
			const vm = new Vue({
				el:'#demo',
				data:{
					school:'尚硅谷',
					address:'宏福科技园',
					tel:'010-56253825'
				}
			})
			
			console.log(vm)
		</script>
	</body>
</html>